{{include file='../templates/sub/00_start.tpl'}}
{{include file='../sys/01_notice.tpl'}}
{{include file='../sys/02_script.tpl'}}
{{include file='../templates/sub/01_head.tpl'}}
{{$navindex="checkout"}}
{{include file='../templates/sub/02_nav.tpl'}}
<div class="gird_24 dpage">
    <div class="dcontent" style="padding: 28px 0">
        <div class="dbr5" style="position: relative;min-height: 400px;background: rgb(247,247,247);-webkit-box-shadow:  0px 0px 6px #000;-moz-box-shadow:  0px 0px 6px #000;box-shadow:  0px 0px 6px #000;">
            <div style="padding:20px 0 20px 20px;position: relative">
                <div class="" style="width: 638px;border: 1px solid #ccc;padding: 8px 20px 0px 20px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;margin-left: 0px;">
                    <div class="tit" style="width: 640px">
                        <h1>
                            Đơn Đặt Hàng
                        </h1>
                    </div>
                    <div style="min-height: 400px;padding: 20px 0">
                        {{if isset($data["oProduct"])}}
                            <input type="hidden" id="txtID" value="{{$data["oProduct"]["ProductID"]}}"/>
                            <input type="hidden" id="txtCustomerID" value="{{if isset($_SESSION["D-USER"])}}{{$_SESSION["D-USER"]["CustomerID"]}}{{/if}}"/>  
                            <fieldset>
                                <legend><b>Thông tin sản Phẩm</b></legend>

                                <table style="width: 100%" class="dt">
                                    <tr>
                                        <td><b>Sản Phẩm</b></td>
                                        <td><b>Đơn giá</b></td>
                                        <td><b>Số Lượng</b></td>
                                        <td style="text-align: right"><b>Thành Tiền</b></td>
                                    </tr>
                                    <tr>
                                        <td>{{$data["oProduct"]["ProductName"]}}</td>
                                        <td>{{number_format($data["oProduct"]["UnitsOnOrder"], 0, ',', '.')}}<sup>đ</sup></td>
                                        <td><input style="width: 60px" id="txtAmount" min="1" type="number" value="1" onchange="amountChange()"/></td>
                                        <td style="text-align: right;font-weight: bold;" id="thanhtien">{{number_format($data["oProduct"]["UnitsOnOrder"], 0, ',', '.')}}<sup>đ</sup></td>
                                    </tr>
                                </table>
                            </fieldset>

                            <div id="Step1">
                                <div class="tit" style="width: 640px">
                                    <h1>
                                        Thông tin thanh toán
                                    </h1>
                                </div>
                                <div style="padding: 20px 0">
                                    <form action="{{base_url("sys/excution/nothing")}}" 
                                          name="frmCheckout"
                                          target="integration_asynchronous"
                                          onsubmit="checkoutNext()"
                                          method="post">
                                        <input type="submit" style="width: 0;height: 0;margin: 0;padding: 0;border: 0"/>
                                        <table style="width: 100%">
                                            <tr>
                                                <td class="dvam w100px">Họ và tên</td>
                                                <td class="pl0 ml0 mr0 pr0">
                                                    <input type="text" id="txtName" name="txtName" placeholder="Họ và tên" 
                                                           value="{{if isset($_SESSION["D-USER"])}}{{$_SESSION["D-USER"]["CustomerName"]}}{{/if}}"
                                                           class="pl4 pb4 pt4 pr4 ml0"/>
                                                </td>
                                                <td class="dvam tar"><span class="pr20">Số điện thoại</span></td>
                                                <td class="tar pl0 ml0 mr0 pr0">
                                                    <input type="text" id="txtPhone" name="txtPhone" placeholder="Số điện thoại" 
                                                           value="{{if isset($_SESSION["D-USER"])}}{{$_SESSION["D-USER"]["Phone"]}}{{/if}}"
                                                           class="pl4 pb4 pt4 pr4 ml0 mr0"/>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="dvam ">Địa chỉ</td>
                                                <td colspan="3" class="pr10 pl0 ml0 mr0" style="padding-right: 10px">
                                                    <textarea id="txtAddress" name="txtAddress" placeholder="Địa chỉ." rows="1" 
                                                              {{if isset($_SESSION["D-USER"])}}{{$_SESSION["D-USER"]["Address"]}}{{/if}}
                                                              style="width: 100%;resize: none" class="pl4 pb4 pt4 pr4 ml0 w100pc rsv"></textarea>
                                                </td>
                                                <td></td>
                                            </tr>
                                            <tr>
                                                <td class="dvam w100px">Khu vực</td>
                                                <td class="pl0 ml0 mr0 pr0">
                                                    <select id="cbxTinh" name="cbxTinh" class="pl4 pb4 pt4 pr4" style="width: 160px;margin-right: 0px" > 
                                                        <option value="">[ --- Tỉnh/Thành phố --- ]</option>
                                                        {{foreach $data["oCitys"] as $c}}
                                                            <option value="{{$c->ID}}">{{$c->TenTinhThanh}}</option>
                                                        {{/foreach}}
                                                    </select>
                                                </td>
                                                <td class="tac pl0 ml0 mr0 pr0">
                                                    <span id="boxQuan">
                                                        <select id="cbxQuan" name="cbxQuan" class="pl4 pb4 pt4 pr4" style="width: 160px;margin-right: 0px" > 
                                                            <option value="">[ --- Quận/Huyện --- ]</option>
                                                        </select>
                                                    </span>
                                                </td>
                                                <td class="tar pl0 ml0 mr0 pr0">
                                                    <span id="boxPhuong">
                                                        <select id="cbxPhuong" class="pl4 pb4 pt4 pr4" style="width: 160px;margin-right: 0px" > 
                                                            <option>[ --- Phường/Xã --- ]</option>
                                                        </select>
                                                    </span>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="dvam ">Nội dung</td>
                                                <td colspan="3" class="pr10 pl0 ml0 mr0" style="padding-right: 10px;">
                                                    <textarea id="txtNote" name="txtNote" placeholder="Nội dung, ghi chú." style="width: 100%;resize: vertical" class="pl4 pb4 pt4 pr4 ml0 w100pc rsv"></textarea>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="dvam "></td>
                                                <td colspan="3">
                                                    <input type="checkbox" id="unShip" name="unShip"/><label>Tôi sẽ đến văn phòng Deal để thanh toán và nhận hàng.</label>
                                                </td>
                                            </tr>
                                        </table>
                                    </form>
                                </div>
                                <div class="pl100 pr20" id="checkouterr" style="font-family: tahoma;font-size: 11px;color: red"></div>   
                                <div style="position: relative;height: 40px">
                                    <div class="nextbtn" onclick="checkoutNext()">
                                        <img src="{{base_url()}}deal_css/images/tiep-theo.png"/>
                                    </div>
                                </div>
                            </div>
                            <div id="Step2" class="hidden">
                                <fieldset>
                                    <legend><b>Thông tin đặt hàng</b></legend>
                                    <div id="checkoutInfo"></div>
                                </fieldset>
                                <div class="pl100 pr20" id="checkouterr2" style="font-family: tahoma;font-size: 11px;color: red"></div>   
                                <div id="btnStep2" class="mt20" style="position: relative;height: 40px;padding-bottom: 20px">
                                    <div class="prebtn" onclick="checkoutBack()">
                                        <img src="{{base_url()}}deal_css/images/quay-lai.png"/>
                                    </div>
                                    <div class="nextbtn" onclick="checkoutDone();">
                                        <img src="{{base_url()}}deal_css/images/hoan-thanh.png"/>
                                    </div>
                                </div>
                            </div>
                        {{else}}
                            Sản phẩm không tồn tại. hoặc đã tạm ngưng cung cấp.
                        {{/if}}
                    </div>
                </div>
            </div>
            <div class="" style="width: 240px;position: absolute;top: 20px;right: 20px;">
                {{if isset($data["oNote1"])}}
                    <div class="" style="
                         width: 200px;
                         border: 1px solid #ccc;
                         padding: 8px 20px 0px 20px;-webkit-border-radius: 5px;
                         min-height: 200px;
                         -moz-border-radius: 5px;
                         border-radius: 5px;
                         margin-left: 0px;
                         margin-bottom: 20px;">
                        <div class="tit" >
                            <h2 style="overflow: hidden">
                                {{$data["oNote1"]["title"]}}
                            </h2>
                        </div>
                        <div>
                            {{$data["oNote1"]["content"]}}
                        </div>
                    </div>
                {{/if}}
                {{if isset($data["oNote2"])}}
                    <div class="" style="
                         width: 200px;
                         border: 1px solid #ccc;
                         padding: 8px 20px 0px 20px;-webkit-border-radius: 5px;
                         min-height: 200px;
                         -moz-border-radius: 5px;
                         border-radius: 5px;
                         margin-left: 0px;
                         margin-bottom: 20px;">
                        <div class="tit" >
                            <h2 style="overflow: hidden">
                                {{$data["oNote2"]["title"]}}
                            </h2>
                        </div>
                        <div>
                            {{$data["oNote2"]["content"]}}
                        </div>
                    </div>
                {{/if}}
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    Number.prototype.formatMoney = function(c, d, t){
        var n = this, c = isNaN(c = Math.abs(c)) ? 2 : c, d = d == undefined ? "," : d, t = t == undefined ? "." : t, s = n < 0 ? "-" : "", i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "", j = (j = i.length) > 3 ? j % 3 : 0;
        return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
    };
    function amountChange(n){
        var n=$("#txtAmount").val();
        var myMoney=parseInt(n)*{{$data["oProduct"]["UnitsOnOrder"]}};
        $("#thanhtien").html(myMoney.formatMoney(0, ',', '.')+"<sup>đ</sup>");
    }
    $(document).ready(function(){
        $("#cbxTinh").change(function(){
            if($(this).val()!=""){
                $("#boxQuan").html('<select id="cbxQuan" class="pl4 pb4 pt4 pr4" style="width: 160px;margin-right: 0px" >\
                <option value="">[ --- Đang tải --- ]</option>\
                </select>');
                $("#boxPhuong").html('<select id="cbxPhuong" class="pl4 pb4 pt4 pr4" style="width: 160px;margin-right: 0px" >\
                <option value="">[ --- Phường/Xã --- ]</option>\
                </select>');
                htmlAjax("{{base_url()}}Excution/htmlDistrict/"+$(this).val(), {}, $("#boxQuan"))
            }else{
                $("#boxQuan").html('<select id="cbxQuan" class="pl4 pb4 pt4 pr4" style="width: 160px;margin-right: 0px" >\
                <option value="">[ --- Quận/Huyện --- ]</option>\
                </select>');
                $("#boxPhuong").html('<select id="cbxPhuong" class="pl4 pb4 pt4 pr4" style="width: 160px;margin-right: 0px" >\
                <option value="">[ --- Phường/Xã --- ]</option>\
                </select>');
            }
        });
    });
    function DistricChange(){
        if($("#cbxQuan").val()!=""){
            $("#boxPhuong").html('<select id="cbxPhuong" class="pl4 pb4 pt4 pr4" style="width: 160px;margin-right: 0px" >\
            <option value="">[ --- Đang tải --- ]</option>\
            </select>');
            htmlAjax("{{base_url()}}Excution/htmlWard/"+$("#cbxQuan").val(), {}, $("#boxPhuong"))
        }else{
            $("#boxPhuong").html('<select id="cbxPhuong" class="pl4 pb4 pt4 pr4" style="width: 160px;margin-right: 0px" >\
            <option value="">[ --- Phường/Xã --- ]</option>\
            </select>');
        }
    }
    function getSelectedText(elementId) {
        var elt = document.getElementById(elementId);
        if (elt.selectedIndex <1)
            return "";
        return elt.options[elt.selectedIndex].text;
    }
    function checkoutBack(){
        $("#Step2").hide();
        $("#Step1").show();
        $("#checkouterr1").html("");
        $("#checkouterr2").html("");
    }
    function checkoutNext(){
        var sErr="";
        if(!_FcheckFilled($("#cbxPhuong").val())){
            sErr="Bạn chưa chọn Phường / Xã.<br/>"+sErr;
            $("#cbxPhuong").focus();
        }
        if(!_FcheckFilled($("#cbxQuan").val())){
            sErr="Bạn chưa chọn Quận / Huyện.<br/>"+sErr;
            $("#cbxQuan").focus();
        }
        if(!_FcheckFilled($("#cbxTinh").val())){
            sErr="Bạn chưa chọn Tỉnh / Thành Phố.<br/>"+sErr;
            $("#cbxTinh").focus();
        }
        if(!_FcheckFilled($("#txtAddress").val())){
            sErr="Địa chỉ không được để trống.<br/>"+sErr;
            $("#txtAddress").focus();
        }
        if(!_FcheckFilled($("#txtPhone").val())){
            sErr="Số điện thoại không được để trống.<br/>"+sErr;
            $("#txtPhone").focus();
        }
        if(!_FcheckFilled($("#txtName").val())){
            sErr="Họ và tên không được để trống.<br/>"+sErr;
            $("#txtName").focus();
        }
        if(sErr==""){
            $("#Step1").hide();
            $("#Step2").show();
            var sShip="";
            if($("#unShip").is(":checked"))sShip="\nTôi sẽ đến văn phòng Deal để thanh toán và nhận hàng.";
            $("#checkoutInfo").html('\
                <table style="width: 100%" class="dt">\
                    <tr>\
                        <td class="w100px"><b>Họ Tên</b></td>\
                        <td>'+$("#txtName").val()+'</td>\
                        <td class="w100px"><b>Điện thoại</b></td>\
                        <td>'+$("#txtPhone").val()+'</td>\
                    </tr>\
                    <tr>\
                        <td><b>Địa chỉ</b></td>\
                        <td colspan="3">'+$("#txtAddress").val()+' [ Phường(Xã) '+getSelectedText("cbxPhuong")+', Quận(Huyện) '+getSelectedText("cbxQuan")+', Tỉnh(Thành Phố) '+getSelectedText("cbxTinh")+' ]</td>\
                    </tr>\
                    <tr>\
                        <td class="tat"><b>Ghi chú</b></td>\
                        <td colspan="3"><pre>'+$("#txtNote").val()+sShip+'</pre></td>\
                    </tr>\
                </table>');
                $("#checkouterr2").html("");
            return;
        }
        $("#checkouterr").html(sErr);
    }
    function checkoutDone(){
        if(isrunning)return;
        var sName=$("#txtName").val();
        var sPhone=$("#txtPhone").val();
        var nAmount=$("#txtAmount").val()
        var nID=$("#txtID").val()
        var sAddress=$("#txtAddress").val()+' [ Phường(Xã) '+getSelectedText("cbxPhuong")+', Quận(Huyện) '+getSelectedText("cbxQuan")+', Tỉnh(Thành Phố) '+getSelectedText("cbxTinh")+' ]';
        var sNote=$("#txtNote").val();
        if($("#unShip").is(":checked")){
            sNote+="\nTôi sẽ đến văn phòng Deal để thanh toán và nhận hàng.";
        }else{
            sNote+="\nTôi sẽ thanh toán khi giao hàng.";
        }
        var surl="{{base_url()}}checkout";
        var odata={
            Name:sName,
            Phone:sPhone,
            ID:nID,
            Amount:nAmount,
            Address:sAddress,
            Note:sNote
        };
        jqxAjax(surl, odata, function(result){
            try{
            if(result.code>=0){
                $("#btnStep2").hide();
                $("#checkouterr2").html(result.msg);
            }else{
                
                $("#checkouterr2").html(result.msg);
            }
            }catch(e){}
        });
    }
</script>
{{include file='../templates/sub/03_foot.tpl'}}
{{include file='../templates/sub/00_end.tpl'}}